﻿<div class="row">
	<div id="bandeau">
		<select id="languageSelection" ng-model="language" ng-options="l for l in languages"></select>
	</div>
	
	<div id="welcomePart" class="row col-md-6 col-md-offset-2">
		
		<div class="col-md-6">
			<h1 id="connectFormTitle">Chat Isima</h1>
			<h2 ng-bind-html="translation.POWERED"></h2>
		</div>
		
	</div>
	
	<div id="connectFormPart" class="col-md-4">
		
		<form name="connectForm">
			
				<div class="blueTitle">{{translation.CONNECT}}</div>
				<div id="errorForm" class="errorField"></div>
				
				<div>
					<span class="errorField" ng-show="connectForm.nickname.$error.required && !connectForm.nickname.$pristine">
						{{translation.ERROR_NICKNAME_REQUIRED}}
					</span>
					<span class="errorField" ng-show="connectForm.nickname.$error.pattern">
						{{translation.ERROR_NICKNAME_PATTERN}}
					</span>
					<input type="text" id="nicknameInput" name="nickname" ng-model="connectFormData.nickname" ng-pattern="/^[a-zA-Z0-9]*$/" placeholder="pseudo" required>
				</div>
				
				<div>
					<div class="leftPart" id="connectFormCheckbox">
						<input type="checkbox" ng-model="connectFormData.rememberMe">
						<span ng-bind-html="translation.STAY"></span>
					</div>
					
					<button ng-click="connect()" ng-disabled="connectForm.$invalid">{{translation.CONNECT}}</button>
				</div>
		</form>
		
	</div>
</div>
